<template>
    <div
     v-for="product in products"
     :key="product.id"
    >
       <p>{{product.name}}-{{product.price}}-{{product.stock}}</p>
       <button 
       :disabled="product.stock<=0"
       @click="addToCart(product)">添加到购物车</button>
    </div>
</template>
<script setup>
import {storeToRefs} from 'pinia'
import {useProductsStore} from '../stores/productsStore'
import {useCartStore} from '../stores/cartStore'
const productsStore = useProductsStore()
const cartStore = useCartStore();
productsStore.fetchProducts()
const {products} = storeToRefs(productsStore)
const {addToCart} = cartStore;
</script>